<template>
	<view class="page">
		<view>
			<view class="u-flex u-row-between " style="background: #00C08D;padding: 50rpx 30rpx 200rpx 30rpx; ">
				<view style="color: #fff;">
					￥ <text style="font-size: 60rpx;">{{money}}</text>
					
					<view>我的余额</view>
				</view>
				<view>
					<u-button @click="withDraw" shape="circle" plain
						:custom-style="{color:'#fff',background:'#00c08d',fontSize:'26rpx'}">
						去提现</u-button>
				</view>
			</view>


			<view
				style="padding: 20rpx;border-radius: 20rpx;  margin: auto;width: 700rpx;background: #fff;position: relative;bottom: 150rpx;min-height: 100vh;">
				<view class="u-flex u-row-around u-text-center" >
					<view @click="current=0" :class="current?'':'change'">
						<view>我的下级</view>
						<view class="u-margin-top-10">{{next_user_num}}人</view>
					</view>
					<view @click="current=1" :class="current?'change':''">
						<view>佣金记录</view>
						<view class="u-margin-top-10">{{withdrawal_money}}元</view>
					</view>
				</view>

				<view v-if="current==0" v-for="(item,index) in next_user_list" :key="index" class="u-flex u-row-between u-padding-20">
					<view class="u-flex">
						<view>
							<u-image shape="circle" :src="item.avatar" width="60" height="60"></u-image>
						</view>
						<view class="u-margin-left-20 u-font-weight">{{item.nickname}}</view>
					</view>
					
					<view class="u-type-info u-font-xs">{{item.createtime}}</view>
				</view>


				<view v-if="current==1" v-for="(item,index) in list" :key="index" class="u-margin-top-20 u-flex u-row-between">
					<view>
						<u-image shape="circle" :src="item.origin_user_info.avatar" width="70" height="70"></u-image>
					</view>
					<view class="u-flex u-row-between  u-margin-left-20 u-flex-1">
						<view>
							<view class="u-font-weight">{{item.origin_user_info.nickname}}</view>
							<view class="u-type-info u-font-xs">订单编号：{{item.trade_no}}</view>
						</view>
						<view>{{item.money}}元</view>
					</view>

				</view>

			</view>
		</view>
	</view>
</template>

<script>
	import loader from '@/common/loadPage.js';
	export default {
		mixins: [loader],
		data() {

			return {
				next_user_list: [],
				nav: [],
				current: 0,
				list: [],
				initial: {
					geturl: "/distribution/distributionLog",
					parm: {

					},
					isPage: true
				},
				money: '',
				next_user_num: '',
				withdrawal_money: ""

			}
		},
		async onLoad() {
			this.getGoods()
			await this.getUser()
		},
		methods: {
			getUser() {
				this.$u.post('/distribution/getNext', {}).then(res => {
					this.money = res.money;
					this.next_user_list = res.next_user_list;
					this.next_user_num = res.next_user_num;
					this.withdrawal_money = res.withdrawal_money
				}).catch(err => {})
			},
			withDraw() {
				uni.navigateTo({
					url: '../withdraw/index'
				})
			}

		}
	}
</script>


<style>
	.page {
		background: #F1F1F1;
		min-height: 100vh;
	}

	.list {
		background: #fff;
		width: 700rpx;
		margin: 20rpx auto;
		padding: 20rpx;
	}
	.change{
		color: #00C08D;
		
		font-weight: bold;
		transition: all  0.3s;
	}
</style>
